<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>css3加载</title>

</head>
<body>


<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">

<!--主要样式-->
<link rel="stylesheet" type="text/css" href="css/style.css">

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 0</p>
			<div class="loader"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 1</p>
			<div class="loader1">
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
			</div>
		</div>
	</div>

</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 2</p>
			<div class="loader2"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 3</p>
			<div class="loader3">
				<span></span>
				<span></span>
			</div>
		</div>
	</div>
</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 4</p>
			<div class="loader4"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 5</p>
			<div class="loader5"></div>
		</div>
	</div>
</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 6</p>
			<div class="loader6"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 7</p>
			<div class="loader7"></div>
		</div>
	</div>
</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 8</p>
			<div class="loader8"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 9</p>
			<div class="loader9"></div>
		</div>
	</div>
</div> 

</body>
</html>